
<!-- 模型项编辑弹窗 -->
<template>
    <div class="ele-body">
        <a-card :title="modelItemModalApp.title" :bordered="false">
            <a-form
                    ref="form2"
                    :model="modelItemModalApp.modelItem"
                    :rules="modelItemModalApp.rules"
                    :label-col="{md: {span: 7}, sm: {span: 24}}"
                    :wrapper-col="{md: {span: 17}, sm: {span: 24}}">
                <a-row :gutter="16">
                                                                                                                                                                                                                                            
                                <a-col :lg="6" :md="12" :sm="24" :xs="24">
                                    <a-form-item label="模型编辑方式:" name="modelItemEditWay">
                                                                                    <a-input
                                                    v-model:value="modelItemModalApp.modelItem.modelItemEditWay"
                                                    placeholder="请输入模型编辑方式"
                                                    :maxlength="255"
                                                    allow-clear
                                            />
                                                                            </a-form-item>
                                </a-col>
                                                                                                                                                            
                                <a-col :lg="6" :md="12" :sm="24" :xs="24">
                                    <a-form-item label="模型项:" name="modelItemName">
                                                                                    <a-input
                                                    v-model:value="modelItemModalApp.modelItem.modelItemName"
                                                    placeholder="请输入模型项"
                                                    :maxlength="255"
                                                    allow-clear
                                            />
                                                                            </a-form-item>
                                </a-col>
                                                                                                                                                            
                                <a-col :lg="6" :md="12" :sm="24" :xs="24">
                                    <a-form-item label="模型数据类型:" name="modelDataTypeId">
                                                                                    <a-input-number
                                                    v-model:value="modelItemModalApp.modelItem.modelDataTypeId"
                                                    placeholder="请输入模型数据类型"
                                                    :min="0"
                                                    :step="1"
                                                    class="ele-fluid"
                                            ></a-input-number>
                                                                            </a-form-item>
                                </a-col>
                                                                                                                                                            
                                <a-col :lg="6" :md="12" :sm="24" :xs="24">
                                    <a-form-item label="数据范围:" name="dataRange">
                                                                                    <a-input
                                                    v-model:value="modelItemModalApp.modelItem.dataRange"
                                                    placeholder="请输入数据范围"
                                                    :maxlength="255"
                                                    allow-clear
                                            />
                                                                            </a-form-item>
                                </a-col>
                                                                                                                                                            
                                <a-col :lg="6" :md="12" :sm="24" :xs="24">
                                    <a-form-item label="长度:" name="length">
                                                                                    <a-input-number
                                                    v-model:value="modelItemModalApp.modelItem.length"
                                                    placeholder="请输入长度"
                                                    :min="0"
                                                    :step="1"
                                                    class="ele-fluid"
                                            ></a-input-number>
                                                                            </a-form-item>
                                </a-col>
                                                                                                                                                            
                                <a-col :lg="6" :md="12" :sm="24" :xs="24">
                                    <a-form-item label="模型ID:" name="modelId">
                                                                                    <a-input-number
                                                    v-model:value="modelItemModalApp.modelItem.modelId"
                                                    placeholder="请输入模型ID"
                                                    :min="0"
                                                    :step="1"
                                                    class="ele-fluid"
                                            ></a-input-number>
                                                                            </a-form-item>
                                </a-col>
                                                                                                                                                            
                                <a-col :lg="6" :md="12" :sm="24" :xs="24">
                                    <a-form-item label="检查方式:" name="checkWay">
                                                                                    <a-input
                                                    v-model:value="modelItemModalApp.modelItem.checkWay"
                                                    placeholder="请输入检查方式"
                                                    :maxlength="255"
                                                    allow-clear
                                            />
                                                                            </a-form-item>
                                </a-col>
                                                                                                                                                            
                                <a-col :lg="6" :md="12" :sm="24" :xs="24">
                                    <a-form-item label="检查正则表达式:" name="checkRegex">
                                                                                    <a-input
                                                    v-model:value="modelItemModalApp.modelItem.checkRegex"
                                                    placeholder="请输入检查正则表达式"
                                                    :maxlength="255"
                                                    allow-clear
                                            />
                                                                            </a-form-item>
                                </a-col>
                                                                                                                                                            
                                <a-col :lg="6" :md="12" :sm="24" :xs="24">
                                    <a-form-item label="检查消息:" name="checkMessage">
                                                                                    <a-input
                                                    v-model:value="modelItemModalApp.modelItem.checkMessage"
                                                    placeholder="请输入检查消息"
                                                    :maxlength="255"
                                                    allow-clear
                                            />
                                                                            </a-form-item>
                                </a-col>
                                                                                                                                                            
                                <a-col :lg="6" :md="12" :sm="24" :xs="24">
                                    <a-form-item label="显示列:" name="displayCol">
                                                                                    <a-input-number
                                                    v-model:value="modelItemModalApp.modelItem.displayCol"
                                                    placeholder="请输入显示列"
                                                    :min="0"
                                                    :step="1"
                                                    class="ele-fluid"
                                            ></a-input-number>
                                                                            </a-form-item>
                                </a-col>
                                                                                                                                                            
                                <a-col :lg="6" :md="12" :sm="24" :xs="24">
                                    <a-form-item label="非空:" name="notNull">
                                                                                    <a-input-number
                                                    v-model:value="modelItemModalApp.modelItem.notNull"
                                                    placeholder="请输入非空"
                                                    :min="0"
                                                    :step="1"
                                                    class="ele-fluid"
                                            ></a-input-number>
                                                                            </a-form-item>
                                </a-col>
                                                                                                                                                            
                                <a-col :lg="6" :md="12" :sm="24" :xs="24">
                                    <a-form-item label="分类:" name="sort">
                                                                                    <a-input-number
                                                    v-model:value="modelItemModalApp.modelItem.sort"
                                                    placeholder="请输入分类"
                                                    :min="0"
                                                    :step="1"
                                                    class="ele-fluid"
                                            ></a-input-number>
                                                                            </a-form-item>
                                </a-col>
                                                                                                                                                            
                                <a-col :lg="6" :md="12" :sm="24" :xs="24">
                                    <a-form-item label="父ID:" name="parentId">
                                                                                    <a-input-number
                                                    v-model:value="modelItemModalApp.modelItem.parentId"
                                                    placeholder="请输入父ID"
                                                    :min="0"
                                                    :step="1"
                                                    class="ele-fluid"
                                            ></a-input-number>
                                                                            </a-form-item>
                                </a-col>
                                                                                                                                                            
                                <a-col :lg="6" :md="12" :sm="24" :xs="24">
                                    <a-form-item label="Splice模型项:" name="spliceModelItemName">
                                                                                    <a-input
                                                    v-model:value="modelItemModalApp.modelItem.spliceModelItemName"
                                                    placeholder="请输入Splice模型项"
                                                    :maxlength="255"
                                                    allow-clear
                                            />
                                                                            </a-form-item>
                                </a-col>
                                                                                                                                                            
                                <a-col :lg="6" :md="12" :sm="24" :xs="24">
                                    <a-form-item label="模型项类型:" name="modelItemType">
                                                                                    <a-input
                                                    v-model:value="modelItemModalApp.modelItem.modelItemType"
                                                    placeholder="请输入模型项类型"
                                                    :maxlength="255"
                                                    allow-clear
                                            />
                                                                            </a-form-item>
                                </a-col>
                                                                                                                                                            
                                <a-col :lg="6" :md="12" :sm="24" :xs="24">
                                    <a-form-item label="输入提示:" name="inputTips">
                                                                                    <a-input
                                                    v-model:value="modelItemModalApp.modelItem.inputTips"
                                                    placeholder="请输入输入提示"
                                                    :maxlength="255"
                                                    allow-clear
                                            />
                                                                            </a-form-item>
                                </a-col>
                                                                                                                                                            
                                <a-col :lg="6" :md="12" :sm="24" :xs="24">
                                    <a-form-item label="选择:" name="options">
                                                                                    <a-input
                                                    v-model:value="modelItemModalApp.modelItem.options"
                                                    placeholder="请输入选择"
                                                    :maxlength="255"
                                                    allow-clear
                                            />
                                                                            </a-form-item>
                                </a-col>
                                                                                                                                                            
                                <a-col :lg="6" :md="12" :sm="24" :xs="24">
                                    <a-form-item label="数字:" name="digits">
                                                                                    <a-input-number
                                                    v-model:value="modelItemModalApp.modelItem.digits"
                                                    placeholder="请输入数字"
                                                    :min="0"
                                                    :step="1"
                                                    class="ele-fluid"
                                            ></a-input-number>
                                                                            </a-form-item>
                                </a-col>
                                                                                                                                                            
                                <a-col :lg="6" :md="12" :sm="24" :xs="24">
                                    <a-form-item label="交叉表名称:" name="crossTableName">
                                                                                    <a-input
                                                    v-model:value="modelItemModalApp.modelItem.crossTableName"
                                                    placeholder="请输入交叉表名称"
                                                    :maxlength="255"
                                                    allow-clear
                                            />
                                                                            </a-form-item>
                                </a-col>
                                                                                                                                                            
                                <a-col :lg="6" :md="12" :sm="24" :xs="24">
                                    <a-form-item label="横排:" name="crossRowName">
                                                                                    <a-input
                                                    v-model:value="modelItemModalApp.modelItem.crossRowName"
                                                    placeholder="请输入横排"
                                                    :maxlength="255"
                                                    allow-clear
                                            />
                                                                            </a-form-item>
                                </a-col>
                                                                                                                                                            
                                <a-col :lg="6" :md="12" :sm="24" :xs="24">
                                    <a-form-item label="交叉列名:" name="crossColumnName">
                                                                                    <a-input
                                                    v-model:value="modelItemModalApp.modelItem.crossColumnName"
                                                    placeholder="请输入交叉列名"
                                                    :maxlength="255"
                                                    allow-clear
                                            />
                                                                            </a-form-item>
                                </a-col>
                                                                                                                                                            
                                <a-col :lg="6" :md="12" :sm="24" :xs="24">
                                    <a-form-item label="排列:" name="array">
                                                                                    <a-input
                                                    v-model:value="modelItemModalApp.modelItem.array"
                                                    placeholder="请输入排列"
                                                    :maxlength="255"
                                                    allow-clear
                                            />
                                                                            </a-form-item>
                                </a-col>
                                                                                                                                                                                                                                                        
                    <a-col :md="12" :sm="24" :xs="24">
                        <a-form-item :wrapper-col="{md: {offset: 6}}" style="margin-bottom: -20px">
                            <!--class="ele-pull-right"-->
                            <div v-if="modelItemModalApp.display">
                                <teleport to="#modelItemEditModalFooter">
                                    <div>
                                        <a-space size="middle">
                                            <a-button @click="modelItemListApp.editModalShowing=false">取消
                                            </a-button>
                                            <a-button
                                                    type="primary"
                                                    @click="onSubmit(modelItemModalApp.modelItem)"
                                                    :loading="loading">提交
                                            </a-button>
                                            <!--<a-button v-if="!eid"
                                                      type="dashed"
                                                      @click="continueSubmit"
                                                      :loading="loading">继续提交
                                            </a-button>-->
                                        </a-space>
                                    </div>
                                </teleport>
                            </div>
                            <div v-if="!modelItemModalApp.display">
                                <a-space size="middle">
                                    <a-button @click="onBack()">返回列表</a-button>
                                    <a-button
                                            type="primary"
                                            @click="onSubmit(modelItemModalApp.modelItem)"
                                            :loading="loading">提交
                                    </a-button>
                                    <!--<a-button v-if="!eid"
                                              type="dashed"
                                              @click="continueSubmit"
                                              :loading="loading">继续提交
                                    </a-button>-->
                                </a-space>
                            </div>

                        </a-form-item>
                    </a-col>
                </a-row>
            </a-form>
        </a-card>

    </div>

</template>

<script>
    import {defineComponent, inject, reactive, onMounted} from 'vue'
    import {useRoute, useRouter} from "vue-router"
    import {ModelItemService} from "@/views/lims/gen/modelItem/modelItemService";
    import {VXETable} from 'vxe-table'
    import {useStore} from "vuex";
    import regions from 'ele-admin-pro/packages/regions.js';

                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                    
                                                
    export default defineComponent({
        components: {
                                                                                },
        setup() {
            // 省市区数据
            const cityData = regions
            const route = useRoute();
            const router = useRouter();
            const store = useStore();
            let routeId = route.params.id;
            let modelItemListApp = inject('modelItemListApp', reactive({}));
            const modelItemModalApp = reactive({
                id: null,
                    modelItem: {},
                isEdit: false,
                display: false
            });
                modelItemModalApp.rules = {
                                                                                                                                                                            modelItemEditWay: [
                                                                                                                {
                            required:  false ,
                                type: 'string',
                                message: '请输入模型编辑方式',
                                trigger: 'blur'
                            }
                        ],
                                                                                    modelItemName: [
                                                                                                                {
                            required:                                 true ,
                                type: 'string',
                                message: '请输入模型项',
                                trigger: 'blur'
                            }
                        ],
                                                                                    modelDataTypeId: [
                                                                                                                {
                            required:                                 true ,
                                type: 'number',
                                message: '请输入模型数据类型',
                                trigger: 'blur'
                            }
                        ],
                                                                                    dataRange: [
                                                                                                                {
                            required:  false ,
                                type: 'string',
                                message: '请输入数据范围',
                                trigger: 'blur'
                            }
                        ],
                                                                                    length: [
                                                                                                                {
                            required:                                 true ,
                                type: 'number',
                                message: '请输入长度',
                                trigger: 'blur'
                            }
                        ],
                                                                                    modelId: [
                                                                                                                {
                            required:                                 true ,
                                type: 'number',
                                message: '请输入模型ID',
                                trigger: 'blur'
                            }
                        ],
                                                                                    checkWay: [
                                                                                                                {
                            required:  false ,
                                type: 'string',
                                message: '请输入检查方式',
                                trigger: 'blur'
                            }
                        ],
                                                                                    checkRegex: [
                                                                                                                {
                            required:  false ,
                                type: 'string',
                                message: '请输入检查正则表达式',
                                trigger: 'blur'
                            }
                        ],
                                                                                    checkMessage: [
                                                                                                                {
                            required:  false ,
                                type: 'string',
                                message: '请输入检查消息',
                                trigger: 'blur'
                            }
                        ],
                                                                                    displayCol: [
                                                                                                                {
                            required:                                 true ,
                                type: 'number',
                                message: '请输入显示列',
                                trigger: 'blur'
                            }
                        ],
                                                                                    notNull: [
                                                                                                                {
                            required:                                 true ,
                                type: 'number',
                                message: '请输入非空',
                                trigger: 'blur'
                            }
                        ],
                                                                                    sort: [
                                                                                                                {
                            required:                                 true ,
                                type: 'number',
                                message: '请输入分类',
                                trigger: 'blur'
                            }
                        ],
                                                                                    parentId: [
                                                                                                                {
                            required:  false ,
                                type: 'number',
                                message: '请输入父ID',
                                trigger: 'blur'
                            }
                        ],
                                                                                    spliceModelItemName: [
                                                                                                                {
                            required:                                 true ,
                                type: 'string',
                                message: '请输入Splice模型项',
                                trigger: 'blur'
                            }
                        ],
                                                                                    modelItemType: [
                                                                                                                {
                            required:  false ,
                                type: 'string',
                                message: '请输入模型项类型',
                                trigger: 'blur'
                            }
                        ],
                                                                                    inputTips: [
                                                                                                                {
                            required:  false ,
                                type: 'string',
                                message: '请输入输入提示',
                                trigger: 'blur'
                            }
                        ],
                                                                                    options: [
                                                                                                                {
                            required:  false ,
                                type: 'string',
                                message: '请输入选择',
                                trigger: 'blur'
                            }
                        ],
                                                                                    digits: [
                                                                                                                {
                            required:  false ,
                                type: 'number',
                                message: '请输入数字',
                                trigger: 'blur'
                            }
                        ],
                                                                                    crossTableName: [
                                                                                                                {
                            required:  false ,
                                type: 'string',
                                message: '请输入交叉表名称',
                                trigger: 'blur'
                            }
                        ],
                                                                                    crossRowName: [
                                                                                                                {
                            required:  false ,
                                type: 'string',
                                message: '请输入横排',
                                trigger: 'blur'
                            }
                        ],
                                                                                    crossColumnName: [
                                                                                                                {
                            required:  false ,
                                type: 'string',
                                message: '请输入交叉列名',
                                trigger: 'blur'
                            }
                        ],
                                                                                    array: [
                                                                                                                {
                            required:  false ,
                                type: 'string',
                                message: '请输入排列',
                                trigger: 'blur'
                            }
                        ],
                                                                                                                                                                                                }

            onMounted(() => {
                //清理数据
                    modelItemModalApp.modelItem = reactive({});
                if (routeId) {//路由
                        modelItemModalApp.id = routeId;
                        modelItemModalApp.display = false;
                    findModelItem(modelItemModalApp.id);
                } else if (modelItemListApp.editModalForEdit) {//修改弹窗
                        modelItemModalApp.id = modelItemListApp.currentId;
                        modelItemModalApp.display = true;
                } else if (!modelItemListApp.editModalForEdit && modelItemListApp.addModalForEdit) {//新增弹窗
                        modelItemModalApp.display = true;
                } else {
                        modelItemModalApp.title = "新增学生";
                }
                if (modelItemModalApp.id) findModelItem(modelItemModalApp.id);
            })

            const findModelItem = (id) => {
                    ModelItemService.findModelItemForView(id).then((res) => {
                        modelItemModalApp.modelItem = res.data;
                    //TODO:为编辑准备.
                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                        modelItemModalApp.title = "编辑学生 " + modelItemModalApp.modelItem.name;
                }).catch(error => {
                    VXETable.modal.message({content: `查找学生出错，原因是：${error.message}`, status: 'error'});
                })
            }

            /*TODO:提交 新增&编辑*/
            const onSubmit = (data) => {
                // debugger;
                //当为数组时用逗号连接
                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                    if (data.eid) {
                    //修改
                        ModelItemService.updateModelItem(data).then((res) => {
                        console.log(res);
                        VXETable.modal.message({content: '操作成功', status: 'success'});
                        setTimeout(onBack, 3000);
                    }).catch(error => {
                        VXETable.modal.message({content: `系统错误，原因是：${error.message}`, status: 'error'});
                    })
                } else {
                    //新增
                        ModelItemService.saveModelItem(data).then((res) => {
                        console.log(res);
                        VXETable.modal.message({content: '操作成功', status: 'success'});
                        setTimeout(onBack, 3000);
                    }).catch(error => {
                        VXETable.modal.message({content: `系统错误，原因是：${error.message}`, status: 'error'});
                    })
                }
            }

            /*TODO:继续提交*/
            const continueSubmit = () => {
                VXETable.modal.message({content: 'error 提示', status: 'error'});
            }

            /*TODO:返回列表*/
            const onBack = () => {
                router.push(`/lims/gen/modelItem`);
                store.dispatch('user/tabRemove', route.fullPath);

            }
                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                    return {
                cityData,
                routeId,
                    modelItemListApp,
                    modelItemModalApp,
                onSubmit,
                continueSubmit,
                onBack,
                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                }

        },
    })
</script>

<style scoped>

</style>
